<!doctype html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="css/common.css">
    <link rel="stylesheet" href="css/main.css">
    <link rel="stylesheet" href="css/jquery-impromptu.min.css">
    <link rel="stylesheet" href="css/jquery-ui.css">
    <title>Document</title>
    <style>

    </style>
</head>

<body>
    <div id="dataLoad" style="display:none; position: fixed; width: 100%; top: 20%; z-index: 1001;">
           <table width=100% height=100% border=0 align=center valign=middle>
            <tr height=50%><td align=center>&nbsp;</td></tr>
            <tr><td align=center><img src="images/loading.gif"/></td></tr>
            <tr><td align=center id="loading_text">提交中，请稍后......</td></tr>
            <tr height=50%><td align=center>&nbsp;</td></tr>
           </table>
         </div>
    <div id="search_bar" class="mt10">
        <div class="box">
            <div class="box_border">
                <div class="box_top"><b class="pl15">数据筛选</b></div>
                <div class="box_center pt10 pb10" style="padding-left: 35%;">
                    <table class="form_table" border="0" cellpadding="0" cellspacing="0">
                        <tr>
                            <td>费用类型</td>
                            <td>
                                 <span class="fl">
                                     <div class="select_border">
                                         <div class="select_containers ">
                                             <select name="" class="select" id="fee_type">
                                                 <option value="1">出差报销</option>
                                                 <option value="2">业务报销</option>
                                             </select>
                                         </div>
                                     </div>
                                 </span>
                            </td>
                            <td>当前状态</td>
                            <td>
                             <span class="fl">
                                 <div class="select_border">
                                     <div class="select_containers ">
                                         <select name="" class="select" id="approve_state">
                                             <option value="4">全部</option>
                                             <option value="0">待审批</option>
                                             <option value="1">已同意</option>
                                             <option value="2">已驳回</option>
                                             <option value="3">已报销</option>
                                         </select>
                                     </div>
                                 </div>
                             </span>
                            </td>
                            <td><input type="button" value="确定" id="confirm_query" class="ext_btn ext_btn_submit"></td>
                        </tr>
                    </table>
                </div>
            </div>
        </div>
    </div>
    <div class="mt10">
        <div class="box">
            <div class="box_border">
                <div class="box_top"><b class="pl15">报销费用信息</b></div>
                <div class="mt10">
                    <div id="table" class="mt10">
                        <div class="box span10 oh" style="margin-left: auto; margin-right: auto">
                            <table id="fee_info" width="100%" border="0" cellpadding="0" cellspacing="0" class="list_table" style="table-layout:fixed; font-size:1.2rem">
                                <tr>
                                    <th class="td_center" style="width:5%">编号</th>
                                    <th class="td_center" style="width:10%">申请人</th>
                                    <th class="td_center" style="width:10%">所属部门</th>
                                    <th class="td_center" style="width:15%">报销类型</th>
                                    <th class="td_center" style="width:15%">总金额</th>
                                    <th class="td_center" style="width:15%">公务卡金额</th>
                                    <th class="td_center" style="width:10%">当前状态</th>
                                    <th class="td_center" style="width:20%">可选操作</th>
                                </tr>
                            </table>
                            <table id="ordinary_fee" width="100%" border="0" cellpadding="0" cellspacing="0" class="list_table" style="table-layout:fixed; font-size:1.2rem; display:none">
                                <tr>
                                    <th class="td_center" style="width:10%">编号</th>
                                    <th class="td_center" style="width:20%">申请人</th>
                                    <th class="td_center" style="width:20%">所属部门</th>
                                    <th class="td_center" style="width:20%">预报金额</th>
                                    <th class="td_center" style="width:15%">当前状态</th>
                                    <th class="td_center" style="width:15%">可选操作</th>
                                </tr>
                            </table>
                            <div class="page mt10">
                                <div class="pagination">
                                    <ul>
                                        <li class="first-child" ><a href="#" id="firstPage">首页</a></li>
                                        <li class="" ><a href="#" id="prevPage">上一页</a></li>
                                        <li class="" ><a href="#" id="nextPage">下一页</a></li>
                                        <li class="last-child " ><a href="#" id="endPage">末页</a></li>
                                        <li class="disabled pagedata" id="page1"><a id="pageInfo">1/20</a></li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div id="app_print_dlg" class="mt10" style="display:none" title="打印窗口">
        <div class="box">
            <div class="box_center">
                <table class="form_table pb15" id="approval_print_table" width="100%" border="0" cellpadding="0" cellspacing="0">
                    <tr>
                        <td class="td_left">差旅费报销单</td>
                        <td>
                         <span class="pl5">
                             <input type="button" id="fee_btn" name="button" class="btn1 btn82 btn_export" value="打印">
                         </span>
                        </td>
                    </tr>
                    <tr>
                        <td class="td_left">嫌疑人报销单</td>
                        <td>
                         <span class="pl5">
                             <input type="button" id="suspect_btn" name="button" class="btn1 btn82 btn_export" value="打印">
                         </span>
                        </td>
                    </tr>
                    <tr>
                        <td class="td_left">超标报销单</td>
                        <td>
                         <span class="pl5">
                             <input type="button" id="over_btn" name="button" class="btn1 btn82 btn_export" value="打印">
                         </span>
                        </td>
                    </tr>
                    <tr>
                        <td class="td_left">未使用公务卡报销单</td>
                        <td>
                         <span class="pl5">
                             <input type="button" id="un_official_btn" name="button" class="btn1 btn82 btn_export" value="打印">
                         </span>
                        </td>
                    </tr>
                </table>
            </div>
        </div>
    </div>

</body>
<script type="text/javascript" src="js/jquery-3.2.1.min.js"></script>
<script type="text/javascript" src="js/jquery-ui.js"></script>
<script type="text/javascript" src="js/common.js"></script>
<script type="text/javascript" src="js/config.js"></script>
<script type="text/javascript" src="js/jquery-impromptu.min.js"></script>
<script>
    //辅助变量，存放当前信息
    var curFeeData = {};
    var firstSet = true;
    //辅助函数，获取当前用户的所有报销信息
    function getUserFeeApprove(){
        $('#loading_text').html('获取中，请稍候......');
        $('#dataLoad').show();
        var data = JSON.parse(window.localStorage.getItem('user_info'));
        var type = $('#fee_type').val();
        var state = $('#approve_state').val();
        var user_id = data.user_id;
        var u = url;
        if(type == 1)
            u += 'BusinessFee/GetMyBusinessFeeInfo.php';
        if(type == 2){
            u += 'OrdinaryFee/GetMyOrdinaryFeeInfo.php';
        }

        $.post(u, {'userID':user_id, 'state':state}, function(ret){
            $('#dataLoad').hide();
            var t = JSON.parse(ret);
            $('#loading_text').html('提交中，请稍后......');
            if(t.state == 1){
                curFeeData = t;
                if(firstSet){
                    createTablePage(t.totalCount);
                    firstSet = false;
                }
                if(type == '1'){
                    createFeeTable();
                }
                if(type == '2') {
                    createOrdinaryFeeTable();
                }

            }
            else{
                $.prompt( "<h3>网络或服务器错误，请稍后再试</h3>",{
                    title: '错误提醒',
                    buttons: {'确定': true}
                });
            }
        })
    }



    //辅助函数，获取业务报销详细费用信息
    function getOrdinaryFeeDetail(id){
        $('#dataLoad').show();

        $.post(url + 'OrdinaryFee/GetOrdinaryFeeDetail.php', {'appID' : curFeeData.data[id-1].fee_id}, function(data){
            $('#dataLoad').hide();
            var t = JSON.parse(data);
            console.log(data);
            if(t.state == 1){
                window.localStorage.setItem('baoxiao', data);
                window.localStorage.setItem('is_history', 0);
                window.localStorage.setItem('approve_state', 0);
                jumpPage('baoxiao_info.html');
            }
            else{
                $.prompt("<h3>服务器忙或网络故障，请稍后再试</h3>", {
                    title: '操作提醒',
                    buttons: {'确定': true}
                });
            }
        })
    }

    //辅助函数，获取差旅报销详细费用信息
    function getFeeDetail(id){
        $('#dataLoad').show();

        $.post(url+'BusinessFee/GetBusinessFeeDetail.php', {'appID' : curFeeData.data[id-1].fee_id}, function(data) {
            $('#dataLoad').hide();
           // console.log(data);
            var t = JSON.parse(data);
            if(t.state == 0){
                $.prompt("<h3>服务器忙或网络故障，请稍后再试</h3>", {
                    title: '操作提醒',
                    buttons: {'确定': true}
                })
            }
            else{
             //   window.localStorage.setItem('curItem', data);
                window.localStorage.setItem('approve_type', 0);
                //表示现在不是历史信息
                window.localStorage.setItem('is_history', 0);
                window.localStorage.setItem('curFeeInfo', data);
                jumpPage('fee_info.html');
            }
        });
    }

    //辅助函数，创建打印对话框
    function initPrintApproveDlg(info){
        if(info.suspect_fee_id == ''){
            $('#app_print_dlg tr').eq(1).hide();
        }
        else{
            $('#app_print_dlg tr').eq(1).show();
        }
        if(info.over_standard_id == ''){
            $('#app_print_dlg tr').eq(2).hide();
        }
        else{
            $('#app_print_dlg tr').eq(2).show();
        }
        if(info.un_official_app_id == ''){
            $('#app_print_dlg tr').eq(3).hide();
        }
        else{
            $('#app_print_dlg tr').eq(3).show();
        }
        //  alert(info.approval_ID);
        $('#fee_btn').unbind('click');
        $('#fee_btn').click(function(e){
            var pdfURL = url + 'PDF/CreateBusinessFeePDF.php';

            var approval_ID = info.fee_id;
            printApprovePDF(pdfURL, approval_ID);
        });
        $('#suspect_btn').unbind('click');
        $('#suspect_btn').click(function(e){
            var pdfURL = url + 'PDF/CreateSuspectFeePDF.php';
            var approval_ID = info.suspect_fee_id;
            printApprovePDF(pdfURL, approval_ID);
        });
        $('#over_btn').unbind('click');
        $('#over_btn').click(function(e){
            var pdfURL = url + 'PDF/CreateOverStandardPDF.php';
            var approval_ID = info.over_standard_id;
            printApprovePDF(pdfURL, approval_ID);
        });
        $('#un_official_btn').unbind('click');
        $('#un_official_btn').click(function(e){
            var pdfURL = url + 'PDF/CreateUnOfficialPDF.php';
            var approval_ID = info.fee_id;
            alert(approval_ID);
            printApprovePDF(pdfURL, approval_ID);
        })

    }

    //辅助函数，打印报销单,嫌疑人费用报销单，超标报销单
    function printApprovePDF(pdfURL, approval_ID){
        $('#dataLoad').show();

        $.post(pdfURL, {'approval_id': approval_ID}, function(data){
            var t= JSON.parse(data);
            $('#dataLoad').hide();
            if(t.state == 1){
                $.prompt("<h3>生成成功</h3>", {
                    title: '操作提醒',
                    buttons: {'确定': true}
                });
                window.open(url + t.url);
            }
            else{
                $.prompt("<h3>网络或数据库错误，请联系管理员</h3>", {
                    title: '错误提醒',
                    buttons: {'确定': true}
                })
            }
        });
    }

    //辅助函数，打印普通业务报销单
    function printOrdinaryFeePDF(approval_ID){
        $('#dataLoad').show();

        $.post(url + 'PDF/CreateOrdinaryFeePDF.php', {'approval_id': approval_ID}, function(data){
            var t= JSON.parse(data);
            $('#dataLoad').hide();
            if(t.state == 1){
                $.prompt("<h3>生成成功</h3>", {
                    title: '操作提醒',
                    buttons: {'确定': true}
                });
                window.open(url + t.url);
            }
            else{
                $.prompt("<h3>网络或数据库错误，请联系管理员</h3>", {
                    title: '错误提醒',
                    buttons: {'确定': true}
                })
            }
        });
    }


    //辅助函数，创建业务报销信息表
    function createOrdinaryFeeTable(){
        $('#fee_info').hide();
        $('#ordinary_fee').show();
        //清空当前数据
        $('.info_tr').empty();
        var start = (curPage-1) * rowPerPage;
        var end = (curFeeData.data.length - start)> rowPerPage ? rowPerPage : curFeeData.data.length;

        for(var i = start; i < end; i++){
            $('#ordinary_fee').append(
                    "<tr class='tr info_tr'>" +
                    "<td class='td_center'>" + ((i+1) + (curPage-1) * rowPerPage) + "</td>" +
                    "<td class='td_center'>" + curFeeData.data[i].user_name + "</td>" +
                    "<td class='td_center'>" + curFeeData.data[i].section_name + "</td>" +
                    "<td class='td_center'>" + curFeeData.data[i].pre_total_fee + "</td>" +
                    "<td class='td_center'>" + getApproveState(curFeeData.data[i].state, curFeeData.data[i].state_detail, true) + "</td>" +
                    "<td class='td_center'>" +
                    "<a class='ext_btn browse browse_btn'><span class='browse'></span>查看</a>"+
                    "<a class='ext_btn print print_btn'><span class='print'></span>打印</a>" +
                    "</td>"+
                    "</tr>");
            if(curFeeData.data[i].state == 0){
                $(".print").eq(i*2).addClass('disabled');
                $(".print").eq(i*2+1).addClass('disabled');
            }
            if(curFeeData.data[i].state == 2){
                $(".print").eq(i*2).addClass('disabled');
                $(".print").eq(i*2+1).addClass('disabled');
            }
        }

        $(".browse_btn").each(function(index, elem){
            if($(elem).hasClass('disabled')){
                return;
            }
            $(this).click(function(e){
                var id = $(this).parent().parent().children('td').eq(0).html();
                getOrdinaryFeeDetail(id);
            })
        });
        $(".print_btn").each(function(index, elem){
            if($(elem).hasClass('disabled')){
                return;
            }
            $(this).click(function(e){
                var id = $(this).parent().parent().children('td').eq(0).html();
                printOrdinaryFeePDF(curFeeData.data[id-1].fee_id);
            })
        })

    }


    //辅助函数，创建差旅报销信息表
    function createFeeTable(){
        $('#fee_info').show();
        $('#ordinary_fee').hide();
        //清空当前数据
        $('.info_tr').empty();

        var start = (curPage-1) * rowPerPage;
        var end = (curFeeData.data.length - start)> rowPerPage ? rowPerPage : curFeeData.data.length;


        for(var i = start; i < end; i++){
            $('#fee_info').append(
                    "<tr class='tr info_tr'>" +
                        "<td class='td_center'>" + ((i+1) + (curPage-1) * rowPerPage) + "</td>" +
                        "<td class='td_center'>" + curFeeData.data[i].user_name + "</td>" +
                        "<td class='td_center'>" + curFeeData.data[i].section_name + "</td>" +
                        "<td class='td_center'>" + getFeeType(curFeeData.type) + "</td>" +
                        "<td class='td_center'>" + curFeeData.data[i].pre_total_fee + "</td>" +
                        "<td class='td_center'>" + curFeeData.data[i].pre_official_fee + "</td>" +
                        "<td class='td_center'>" + getApproveState(curFeeData.data[i].state, curFeeData.data[i].state_detail, true) + "</td>" +
                        "<td class='td_center'>" +
                            "<a class='ext_btn browse browse_btn'><span class='browse'></span>查看</a>"+
                            "<a class='ext_btn modify modify_btn'><span class='modify'></span>修改</a>"+
                            "<a class='ext_btn print print_btn'><span class='print'></span>打印</a>" +
                        "</td>"+
                    "</tr>");
            if(curFeeData.data[i].state == 0){ //待审批
                $(".print").eq(i*2).addClass('disabled');
                $(".print").eq(i*2+1).addClass('disabled');
                $(".modify").eq(i*2).addClass('disabled');
                $(".modify").eq(i*2+1).addClass('disabled');
            }
            if(curFeeData.data[i].state == 1){ //已同意
                $(".modify").eq(i*2).addClass('disabled');
                $(".modify").eq(i*2+1).addClass('disabled');
            }
            if(curFeeData.data[i].state == 2){ //已驳回
                $(".print").eq(i*2).addClass('disabled');
                $(".print").eq(i*2+1).addClass('disabled');
            }
            if(curFeeData.data[i].state == 3){ //已报销
                $(".modify").eq(i*2).addClass('disabled');
                $(".modify").eq(i*2+1).addClass('disabled');
            }

        }

        $(".browse_btn, .modify_btn").each(function(index, elem){
            if($(elem).hasClass('disabled')){
                return;
            }
            $(this).click(function(e){
                var id = $(this).parent().parent().children('td').eq(0).html();
                getFeeDetail(id);
            })
        });
        $(".print_btn").each(function(index, elem){
            if($(elem).hasClass('disabled')){
                return;
            }
            $(this).click(function(e){

                var id = $(this).parent().parent().children('td').eq(0).html();

                initPrintApproveDlg(curFeeData.data[id-1]);
                $('#app_print_dlg').dialog({
                    resizable: false,
                    height: "auto",
                    width: "auto",
                    modal: true,
                    buttons: {
                        '取消': function(){
                            $(this).dialog('close');
                        }
                    }
                })
            })
        })
    }

    //辅助函数，处理数据筛选
    function onConfirmOnDataQuery(){
        $('#confirm_query').click(function(e){
            getUserFeeApprove();
            e.preventDefault();
        })
    }

    $(function(){
        window.localStorage.setItem('approve_state', 0);
        getUserFeeApprove();
        onConfirmOnDataQuery();

        clickFirstPage(createFeeTable);
        clickEndPage(createFeeTable);
        clickNextPage(createFeeTable);
        clickPrevPage(createFeeTable);



    })


</script>
</html>